<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <meta charset="UTF-8">

    <title>Title</title>

    <link href="/css/bootstrap.css" rel="stylesheet">
    <link href="/css/bootstrap-theme.min.css">
    <style>
        div.page {
            color: #337ab7;
        }
    </style>
    <script src="/js/jquery-1.10.1.js"></script>
    <script src="/js/bootstrap.js"></script>

</head>
<body>
<th:block th:include="loading.html"></th:block>
http://localhost:8080/demo/user.action
<div class="container-fluid">
        <form class="form-inline col-xs-offset-3 col-xs-6" action="usersearch.action">
            <div class="form-group">
                <label class="label" for="membername">社員名前</label>
                <input class="form-control" name="membername" id="membername" th:value="${param.membername}" />
            </div>
            <div class="form-group">
                <label class="label">部门</label>
                <select class="form-control" name="departmentid">
                    <option value="">-----</option>
                    <option th:each="dept,stat:${application.dlist}"
                            th:selected="${dept.departmentid+'' eq param.departmentid+''}"
                            th:value="${dept['departmentid']}" th:text="${dept.get('departmentname')}">111</option>
                </select>
            </div>
            <div class="form-group">
               <label class="label">部门</label>
                <input type="submit" class="btn btn-primary form-control" th:value="#{B2001}" />
            </div>
        </form>

    <table class="table table-bordered table-hover">
        <tr>
            <th>No</th>
            <th>员工名</th>
            <th>生日</th>
            <th>部门</th>
            <th>操作</th>
        </tr>
        <tr th:if="" th:each="item,stat : ${mlist?.list}">
            <td th:text="${(mlist.pageNum - 1) * 10 + stat.count}"></td>
            <td th:text="${item.membername}"></td>
            <td th:text="${#dates.format(item.birthday, 'yyyy-MM-dd')}"></td>
            <td th:text="${item.departmentname}"></td>
            <td><button class="btn btn-info">查看</button></td>
        </tr>
    </table>


    <!--   分页组件start -->
    <th:block th:if="${mlist != null}" th:include="/template/pagination :: pageinfo(${mlist})"></th:block>
    <!--   分页组件end -->

    <!--    -->
    <!--    <nav aria-label="Page navigation">-->
    <!--        <div th:text="${'总条数' + mlist.total + '条记录'}" class="page"></div>-->
    <!--        <ul class="pagination">-->
    <!--            <li>-->
    <!--                <a  href="javascript:void(0)" aria-label="Previous" class="Previous">-->
    <!--                    <span aria-hidden="true">&laquo;</span>-->
    <!--                </a>-->
    <!--            </li>-->
    <!--            <li th:each="count:${#numbers.sequence(1, mlist.pages)}"><a class="page-item" href="javascript:void(0)" th:text="${count}">1</a></li>-->
    <!--            <li>-->
    <!--                <a  href="javascript:void(0)" aria-label="Next" class="Next">-->
    <!--                    <span aria-hidden="true">&raquo;</span>-->
    <!--                </a>-->
    <!--            </li>-->
    <!--        </ul>-->
    <!--    </nav>-->
    <!--    <div id="failpage" class="alert alert-danger fade" role="alert"  style="width: 190px; position: fixed; top: 40%; left: 50%; margin-left: -80px;">-->
    <!--        <strong class="message">修改失败!</strong>-->
    <!--    </div>-->
    <!--    <script>-->
    <!--        $("ul.pagination>li").on('click', 'a.page-item', function (e) {-->
    <!--            let num = eval($(e.target).html());-->
    <!--            if ($("form").has("[name='pageNo']")) {-->
    <!--                $("form").append(`<input type=“hidden" name="pageNo" value="${num}" />`)-->
    <!--            } else {-->
    <!--                $("form [name='pageNo']").val(num);-->
    <!--            }-->

    <!--            $("form").submit();-->
    <!--        })-->
    <!--        $("ul.pagination>li>a.Next").on('click', function(){-->
    <!--            let num = 1;-->
    <!--            if ($("form").has("[name='pageNo']")) {-->
    <!--                num = num + 1-->
    <!--                $("form").append(`<input type=“hidden" name="pageNo" value="${num}" />`)-->
    <!--            } else {-->
    <!--                num = $("[name='pageNo']").val() + 1-->
    <!--            }-->
    <!--            $("form [name='pageNo']").val(num);-->
    <!--            $("form").submit();-->
    <!--        })-->
    <!--        $("ul.pagination>li>a.Previous").on("click", function(){-->
    <!--            let num = 1;-->
    <!--            if ($("form").has("[name='pageNo']")) {-->

    <!--                $("#failpage").removeClass("fade").addClass('fadein').children(".message").html("ONEページしました！")-->
    <!--                window.setTimeout(function(){-->
    <!--                    $("#failpage").removeClass("fadein").addClass('fade')-->
    <!--                },1000);//显示的时间-->
    <!--                return;-->
    <!--            } else {-->
    <!--                num = $("[name='pageNo']").val() -  1-->
    <!--            }-->
    <!--            $("form[0] [name='pageNo']").val(num);-->
    <!--            $("form[0]").submit();-->
    <!--        })-->
    <!--    </script>-->
</div>
</body>
</html>